function lunbo(){
//获取整个图片区域
    var list = document.getElementById("list");
//获取向前点击按钮事件
    var befo = document.getElementById("befo");
//获取向前后击按钮事件
    var next = document.getElementById("next");
//获取整个轮播区域 鼠标放上停下效果
    var container = document.getElementById("container");
//获取按钮事件
    var buttons = document.getElementById("buttons");
//获取所有的span标签
    var spans = buttons.getElementsByTagName("span");
//定义一个索引
    var index = 1;

//创建一个函数 遍历所有的span标签  将有class==on的清空样式，将每一个动画的span添加on样式
    function buttonsShow(){
        //这里需要清除之前的样式

        for (var i = 0; i < spans.length; i++) {
            if (spans[i].className == 'color') {
                spans[i].className = '';
            }
        }
        //数组从0开始，故index需要-1
        spans[index - 1].className = 'color';
    }

//函数用来接收点击时数据发生变化 且解决白图问题
    function animation(offset) {
        var newLeft = parseInt(list.style.left) + offset;
        list.style.left = newLeft + "px";
        if (newLeft < -7500) {
            list.style.left = -1500 + 'px';
        }
        if (newLeft > -1500) {
            list.style.left = -7500 + 'px';
        }
    }

//定时动画
    var timer = null;

    function play() {
      timer = setInterval(function () {
            next.onclick();
        }, 2000)
    }

//关闭定时
    function stop() {
        clearInterval(timer);
    }

//为按钮绑定单击响应函数
    befo.onclick = function () {
        index-=1;
        if (index < 1) {
            index = 5;
        }
        buttonsShow();
        animation(1500);
    };
    next.onclick = function () {
        index+=1;
        if (index > 5) {
            index = 1;
        }
        buttonsShow();
        animation(-1500);
    };
    container.onmousemove = stop;
    container.onmouseout = play;
//    同过小圆点找到对应的图片
    for (var i = 0; i < spans.length; i++) {
        spans[i].onclick = function () {
            // 在浏览器的控制台打印一下，看看结果
            /* 偏移量获取：这里获得鼠标移动到小圆点的位置，用this把index绑定到对象buttons[i]上  */
            /* 由于这里的index是自定义属性，需要用到getAttribute()这个DOM2级方法，去获取自定义index的属性*/
            var clickIndex = parseInt(this.getAttribute('index'));
            var offset = 1500 * (index - clickIndex);
            animation(offset); //存放鼠标点击后的位置，用于小圆点的正常显示
            index = clickIndex;
            buttonsShow();
        }
    }
}
lunbo();

//